<template>
  <div class="iframe_box">
    <div
      class="load"
      element-loading-text="拼命加载中"
    ></div>
    <div class="iframe_wrapper">
      <iframe
        :src='src'
        width="100%"
        height="100%"
        ref="iframeDom"
        @load="handleIframeLoad"
      ></iframe>
    </div>
  </div>
</template>
<script>
import * as echarts from 'echarts'


export default {
  data () {
    return {
      dataForm: {
        key: '',
        areaAlarmNo: '',
        areaId: '',
        lableId: '',
        lableEmployid: '',
        alarmTime: ''
      },
      dataList: [],
      dataList1: [{}],
      dataJson: {
        areaAlarmNo: '',
        areaId: '',
        lableId: '',
        lableEmployid: '',
        alarmTime: '',
        chartLine: null,
        chartBar: null,
        chartPie: null,
        chartScatter: null
      },
      dataJson1: [],
      alarmNum: 0,
      pageIndex: 1,
      pageSize: 10,
      totalPage: 0,
      dataListLoading: false,
      dataListSelections: [],
      addOrUpdateVisible: false,
      showSessionId: '',
      src: '',
      timer: null
    }
  },
  mounted() {
    this.showSessionId = window.location.search;
    this.src = `../../../../static/index.html${this.showSessionId}`;

    this.timer = setInterval(() => {
      this.sendData();
    }, 5000);
    // Promise.all([
    //   //每5秒执行一次posChart8
    //   // setInterval(() => {
    //   //   this.posChart8()
    //   // }, 5000),
    //   // this.posChart1(),
    //   this.posChart8()
    // ]).then((results) => {
    //   this.loading = false;
    //   console.log("开始发送数据");
    //   const [result1] = results; // 解析 Promise.all() 结果数组
    //   iframeWin.postMessage(
    //     {
    //       total: result1,
    //     },
    //     "*"
    //   );
    // }).catch((e) => {
    //   console.log("发送错误",e);
    // });
  },
  activated () {


  },
  methods: {
    handleIframeLoad () {
      const iframeWin = this.$refs.iframeDom.contentWindow;
      if (iframeWin){
       this.sendData();
      }

    },
    sendData(){
      //将数据发送给iframe
      this.posChart8().then((result) => {
        let iframeWin = this.$refs.iframeDom.contentWindow;
        console.log("开始发送数据");
        iframeWin.postMessage(
          {
            total: result,
          },
          "*"
        );
      }).catch((e) => {
        console.log("发送错误");
      });
    },
    posChart8() {
      return new Promise((resolve, reject) => {
        this.$http({
          url: this.$http.adornUrl('/wmstate/weldingmachinestate/countStatus'),
          method: 'get'
        }).then(({ data }) => {
          this.total = data;
          console.log(this.total);
          resolve(data); // 解析 Promise 并将 data 传递给 then() 方法
        }).catch(error => {
          reject(error); // 如果出现错误，拒绝 Promise 并传递错误对象
        });
      });
    },
  },
  beforeDestroy () {
    //清除定时器
    if (this.timer) {
      clearInterval(this.timer)
    }
  }
}
</script>
<style lang="scss" scoped>
.iframe_box {
  width: 100%;
  height: 100%;
  position: relative;
}

.iframe_wrapper {
  width: 100%;
  padding-top: 56.25%; /* 16:9 ratio, for an aspect ratio of 4:3 use 75% */
  position: relative;
}

iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
</style>
